<!DOCTYPE html>
<html class="x-admin-sm">
    <head>
        <meta charset="UTF-8">
        <title>角色管理</title>
        <meta name="renderer" content="webkit">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
        <link rel="stylesheet" href="/themes/admin/css/font.css">
        <link rel="stylesheet" href="/themes/admin/css/xadmin.css">
        <script src="/themes/admin/lib/layui/layui.js" charset="utf-8"></script>
        <script type="text/javascript" src="/themes/admin/js/xadmin.js"></script>
        <!--[if lt IE 9]>
          <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
          <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
        <![endif]-->
    </head>
    <body>
        <div class="x-nav">
          <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right" onclick="location.reload()" title="刷新">
            <i class="layui-icon layui-icon-refresh" style="line-height:30px"></i></a>
        </div>
        <div class="layui-fluid">
            <div class="layui-row layui-col-space15">
                <div class="layui-col-md12">
                    <div class="layui-card">
                        <div class="layui-card-header">
                            <button class="layui-btn" onclick="openAddRole(0)"><i class="layui-icon"></i>添加角色</button>
                        </div>
                        <div class="layui-card-body ">
                            <table class="layui-table layui-form">
                              <thead>
                                <tr>
                                  <th>
                                    <input type="checkbox" name=""  lay-skin="primary">
                                  </th>
                                  <th>ID</th>
                                  <th>角色名</th>
                                  <th>创建时间</th>
                                  <th>操作</th>
                              </thead>
                              <tbody>
                              {volist name="list" id="vo"}
                                <tr>
                                  <td>
                                    <input type="checkbox" name=""  lay-skin="primary">
                                  </td>
                                  <td>{$vo.group_id}</td>
                                  <td>{$vo.name}</td>
                                  <td>{$vo.create_time|date='Y-m-d'}</td>
                                  <td class="td-manage">
                                      <button type="button" onclick="updteRole('{$vo.group_id}','{$vo.name}')" class="layui-btn">编辑</button>
                                      <a href="/admin/user/groupRule?id={$vo.group_id}" class="layui-btn layui-btn-normal">配置规则</a>
                                      <button type="button" onclick="group_del(this,'{$vo.group_id}')" class="layui-btn layui-btn-danger">删除</button>
                                  </td>
                                </tr>
                              {/volist}
                              </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
     <div style="display: none;padding: 20px;" id="addRole">
         <form class="layui-form" action="">
             <input type="hidden" id="roleId" value="">
             <div class="layui-form-item">
                 <label class="layui-form-label">角色名</label>
                 <div class="layui-input-block">
                     <input type="text" id="roleName" required  lay-verify="required" placeholder="请输入角色名" autocomplete="off" class="layui-input">
                 </div>
             </div>
             <div class="layui-form-item">
                 <div class="layui-input-block">
                     <button type="button" class="layui-btn" onclick="addRole()">提交</button>
                     <button type="reset" class="layui-btn layui-btn-primary">重置</button>
                 </div>
             </div>
         </form>
     </div>
    </body>
    <script>
      /*删除*/
      function group_del(obj,id){
          layer.confirm('确认要删除吗？',function(index){
              //发异步删除数据
              $.ajax({
                  type:"POST",
                  data:{id:id},
                  url:"/admin/user/delGroup",
                  success:function(e){
                      if(e.code == 1){
                          $(obj).parents("tr").remove();
                          layer.msg(e.msg, {icon: 1});
                      }else{
                          layer.msg(e.msg, {icon: 2});
                      }
                  }
              })
          });
      }
      /*编辑*/
      var winText = '添加角色';
      function updteRole(id,roleName) {
          $("#roleId").val(id);
          $("#roleName").val(roleName)
          winText = "编辑角色";
          openAddRole();
      }
      /*添加角色*/
        function openAddRole(status) {
           if (status == 0){
               $("#roleId").val("");
               $("#roleName").val("")
               winText = "添加角色";
           }
            layer.open({
                type:1,
                title: winText
                ,content: $('#addRole')
            });
        }
        function addRole() {
            var roleName = $("#roleName").val();
            var id = $("#roleId").val();
            $.ajax({
                type:"POST",
                data: {
                    id:id,
                    roleName:roleName
                },
                url: "/admin/user/addRole",
                success:function (e) {
                    if(e.code == 1){
                        location.reload()
                        layer.msg(e.msg, {icon: 1});
                    }else{
                        layer.msg(e.msg, {icon: 2});
                    }
                }
            })
        }
    </script>
</html>